<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>orderform</title>
    <link  href="../static/bootstrap-3.3.7/css/bootstrap.min.css" th:href="@{bootstrap-3.3.7/css/bootstrap.min.css}" rel="stylesheet" type="text/css" />
    <script src="../static/bootstrap-3.3.7/js/jquery-1.11.3.min.js" th:src="@{bootstrap-3.3.7/js/jquery-1.11.3.min.js}"  type="text/javascript"></script>
    <script src="../static/bootstrap-3.3.7/js/bootstrap.min.js" th:src="@{bootstrap-3.3.7/js/bootstrap.min.js}" type="text/javascript"></script>
    <script src="../static/My97DatePicker/WdatePicker.js" th:src="@{My97DatePicker/WdatePicker.js}" type="text/javascript" ></script>

    <style type="text/css">
        body{
            background-color: #f1f2f6;
        }

        .foot{
            position:relative;
            bottom:0;
            height: 100px;
            margin-top: 50px;
            padding-top: 30px;
            width: 100%;
            text-align:center;
            background-color: white;
            font-size: 12px;
        }

        .glyphicon-user{
            color:coral;
            font-size:20px;
        }

        .fcolor{
            color: white;
            font-size:20px;
        }
        input{
            border-bottom: 1px solid #dbdbdb;
            border-top:0px;
            border-left:0px;
            border-right:0px;
        }
    </style>
</head>
<body>
<!--  	描述：导航条    -->
<nav class="navbar navbar-default" role="navigation" style="background-color: white; height: 80px;margin-bottom: 0px">
    <div class="container">
        <div class="row">
            <div class="navbar-header">
                <a class="navbar-brand" href="">
                    <i style="display: inline-block;background-color: #5cb85c; width: 150px;height:50px;
                        background: url(../static/img/bg/piaodekuai.png) no-repeat center; background-size: 100px 50px; "></i>
                    <!-- <span style="color:#0652DD; font-size:30px;width: 30px;">飘得快</span>-->
                </a>
            </div>
            <!--<div class="nav navbar-nav" style="width: 80%;padding-top: 25px;padding-left: 80px">
                <a href=""><span style="float: left;font-size: 20px">首页&nbsp;</span></a>
                <div style="float: left;border-bottom: 1px solid #dbdbdb;width: 30%;margin-top: 15px;"></div>
                <span style="color: #ffa801;float: left;font-size: 20px">&nbsp;&nbsp;登录中心</span>
            </div>-->
            <div class="nav navbar-nav navbar-right" style="padding-top: 25px; margin-right: 0px">
                <a href="/customerCenter">
                    <span class="fcolor glyphicon glyphicon-user" style="color: #6A6AFF;font-size: 20px"></span>
                    <span style="color: #1e272e;font-size: 15px" >你好，李白</span>
                </a>
<!--                &nbsp;&nbsp;
                <a href="#">
                    <span class="fcolor glyphicon glyphicon-pencil" style="color: #6A6AFF;font-size: 20px"></span>
                    <span style="color: #1e272e;font-size: 15px" >注册</span>
                </a>-->
            </div>
        </div>
    </div>
</nav>

<div class="container">
    <div class="row">
        <div>
            <h3>待付订单</h3>
        </div>
    </div>
    <div class="row" style="background-color:#ffffff; border: 1px dashed #dbdbdb;margin-top: 10px;
                    -moz-box-shadow: 0px 1px 2px  #909090;-webkit-box-shadow: 0px 1px 2px  #909090;">
        <div class="col-md-8" style="padding: 20px">
            <p>
                <span style="font-size: 25px; color: #00a8ff">未支付</span>
                <span>请在最晚支付时间20：18前支付，完成支付才能锁定价格</span>
            </p>
            <p>
                <span>10月21日&nbsp;&nbsp;周一</span>
                <span>&nbsp;&nbsp;济南-上海&nbsp;&nbsp;</span>
                <span>17:30</span>
                <span style="font-size: 12px;color: #747d8c;">1h35m</span>
                <span>17:30</span>
            </p>
            <p style="font-size: 12px;color: #747d8c">中国国航&nbsp;CA1167&nbsp;&nbsp;波音738&nbsp;&nbsp;公务舱</p>
            <p>
                <span>订单号</span>
                <span>11256785564</span>
            </p>
            <p>
                <span>总金额</span>
                <span style="font-size: 20px; color: #e84118">￥1150</span>
                &nbsp;&nbsp;
                <a>订单详情</a>
            </p>
        </div>
        <div class="col-md-4">
            <div style="border-left: 2px dashed #dbdbdb; height: 170px;margin-top: 10px; float:left"></div>
            <div style="margin-top:80px;margin-left: 30px; user-select:none;color: #ced6e0">
                <span>订票无忧</span><br>
                <span>价格保证，确保出行</span>
            </div>
            <br>
            <div>
                <div style="float: right; padding-left: 5px">
                    <button class="btn btn-block" style="width:80px; background-color: #00a8ff; color:  #ffffff">取消</button>
                </div>

                <div style="float: right">
                    <button class="btn btn-block" style="width:80px; background-color: #ff4757; color:  #ffffff">支付</button>
                </div>
            </div>
        </div>
    </div>


    <div class="row">
        <div>
            <h3>已付订单</h3>
        </div>
    </div>
    <div class="row" style="background-color:#ffffff; border: 1px dashed #dbdbdb;margin-top: 10px;
                    -moz-box-shadow: 0px 1px 2px  #909090;-webkit-box-shadow: 0px 1px 2px  #909090;">
        <div class="col-md-8" style="padding: 20px">
            <p>
                <span style="font-size: 25px; color: #00a8ff">已支付</span>
                <span>请在20：18前登机</span>
            </p>
            <p>
                <span>10月21日&nbsp;&nbsp;周一</span>
                <span>&nbsp;&nbsp;济南-上海&nbsp;&nbsp;</span>
                <span>17:30</span>
                <span style="font-size: 12px;color: #747d8c;">1h35m</span>
                <span>17:30</span>
            </p>
            <p style="font-size: 12px;color: #747d8c">中国国航&nbsp;CA1167&nbsp;&nbsp;波音738&nbsp;&nbsp;公务舱</p>
            <p>
                <span>订单号</span>
                <span>11256785564</span>
            </p>
            <p>
                <span>总金额</span>
                <span style="font-size: 20px; color: #e84118">￥1150</span>
                &nbsp;&nbsp;
                <a>订单详情</a>
            </p>
        </div>
        <div class="col-md-4">
            <div style="border-left: 2px dashed #dbdbdb; height: 170px;margin-top: 10px; float:left"></div>
            <div style="margin-top:80px;margin-left: 30px; user-select:none;color: #ced6e0">
                <span>订票无忧</span><br>
                <span>价格保证，确保出行</span>
            </div>
            <br>
            <div>
                <div style="float: right; padding-left: 5px">
                    <button class="btn btn-block" style="width:80px; background-color: #00a8ff; color:  #ffffff">改签</button>
                </div>

                <div style="float: right">
                    <button class="btn btn-block" style="width:80px; background-color: #ff4757; color:  #ffffff">退票</button>
                </div>
            </div>
        </div>
    </div>

</div>



<div class="foot">
    <p>网站导航 | 宾馆索引 | 用户协议 | 关于携程 | 企业公民 | 诚聘英才 | 分销联盟 | 企业礼品卡采购 | 代理合作 | 广告业务 | 联系我们 | 返回旧版</p>
    <span>Copyright © 2019-2019, 第九组 All rights reserved.</span>
</div>

</body>
</html>